<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head th:replace="common/mall-common :: common_head(~{::title},~{::link},~{::script})">
    <title>网上图书商城</title>
    <link rel="stylesheet" href="/styles/mall/order-detail.css">
    <script src="/javascript/mall/order-detail.js" type="text/javascript"></script>
</head>
<body>
<div th:replace="common/mall-common::mall-header"></div>
<div class="mall-body">
    <div class="items-title">订单详情：</div>
    <div class="title" th:text="'订单详情 (ID：' + ${order.id} + '）'"></div>
    <div class="top-line">
        <div class="order-date" th:text="'订单时间：' + ${order.createAt}"></div>
        <div class="order-price" th:text="'共支付 ' + ${order.totalPrice} + ' 元'"></div>
    </div>
    <div class="shipping-address" th:text="'收货地址：' + ${order.shippingAddress}"></div>
    <div class="order-state" th:text="'订单状态：' + ${order.state == 0 ? '待支付' : '已完成'}"></div>
    <div class="items-title">当前订单包含了以下商品：</div>
    <div class="order-item-list">
        <div class="order-item" th:each="item:${order.orderItemDTOList}">
            <img th:src="${item.booksSkuDTO.getBooksSkuImgList().get(0).getImage()}" class="goods-image"/>
            <div class="sku-info">

                <div class="goods-name" th:text="${item.books.getName()}"></div>
                <div class="goods-place" th:text="'作者：' + ${item.books.author}"></div>
                <div class="goods-place" th:text="'出版社：' +${item.books.belongpublish.name}"></div>
            </div>
            <div class="count" th:text="${'数量：' + item.count}"></div>
        </div>
    </div>
    <div class="action-line">
        <a type="button" class="btn btn-success" th:if="${order.state == 0}" th:href="${'/completePay?orderId=' + order.id}">去支付</a>
    </div>
</div>
<div th:replace="common/mall-common::mall-footer"></div>
</body>
</html>